import {useState} from "react";

//兄弟之间组件通信
//核心：在A组件中调用父组件中的函数并传递数据,父组件中接收数据并传递给B组件
const A = ({getAMsg}) => {
    const msg = 'this is son message!'
    return (
        <div>
            <h2>this is A component</h2>
            <button onClick={() => {
                getAMsg(msg)
            }}>send B message
            </button>
        </div>
    )
}

const B = (props) => {
    return (
        <div>
            <h2>this is B component,{props.msg}</h2>

        </div>
    )
}
export const App = () => {
    const [data, setData] = useState('')
    const getAMsg = (msg) => {
        setData(msg)
    }
    return (
        <div>
            <h2>this is app</h2>
            <A getAMsg={getAMsg}/>
            <B msg={data}/>
        </div>
    )
}
